:root {
    --main-color: #191919;
    --rose-color: #df0e62;
    --now-btn-color: #127681;
    --register-btn-color: #f06553;
    --chapter-block-color: #272626;
    --chapter-color: #525151;
    --rotate-logo-color: #2e2e2e;
    --text-color: #1d1d1f;
    --tab-text-color: #c8c8c8;
    --border-color: #f6f6f6;
    --form-tips-color: #e9e5e5;
    --item-bg-color: #1f1f1f;
    --task-color: #f2456b;
    --tab-color: #fd6084;
    --exchange-color: #f58892;
    --timeline-bg-color: #F9B3BA;
    --exchange-btn-color: #B3572E;
    --title-font-size: 7.5vmin;
    --normal-font-size: 5.3vmin;
    --middle-font-size: 4.9vmin;
    --small-font-size: 4vmin;
    --mini-font-size: 3.35vmin;
    --tabbar-height: 55px;
    --popup-text-color: #F1436A;
}

#app {
    padding-bottom: var(--tabbar-height);
}

::-webkit-scrollbar {
    display: none;
}

@keyframes insetDiffuse {
    0% {
        box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, .5)
    }

    100% {
        box-shadow: 0px 0px 0px 10px rgba(255, 255, 255, 0)
    }
}

@keyframes diffuse {
    0% {
        box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, .5)
    }

    100% {
        box-shadow: 0px 0px 0px 10px rgba(255, 255, 255, 0)
    }
}

.orange {
    color: #FD5D19;
}

.yellow-text {
    color: var(--popup-text-color);
}

.red-text {
    color: var(--popup-text-color);
    width: 59vmin;
    font-weight: bold;
    text-align: center;
    font-size: 5vmin;
}